<template>
	<view class="container">
		<view v-if="show_test"  >
			<swiper :indicator-dots="true" indicator-active-color="#f00" :autoplay="true" :interval="3000"
				:duration="1000">
				<swiper-item v-for="(item,index) in imgList" :key="index">
					<view class="swiper-item" @click="gotoDetail(item.adLinkUrl)">
						<image :src="item.adImgUrl" mode="widthFix"></image>
					</view>
					<view class="swiper-item-text">{{item.adDesc}}</view>
				</swiper-item>

			</swiper>
		</view>
		<view v-if="show_test" class="view-btn" :class="loginFlag">
			<view>
				<button @click="gotoRegister" class="uni-btn uni-btn-small" type="primary" plain="true">注册</button>
			</view>
			<view>
				<button @click="gotoLogin" class="uni-btn uni-btn-small" type="primary">登录</button>
			</view>
		</view>
		<view v-if="show_test" class="view-ad">
			<text @click="gotoDetail2(linkUrl)">了解跟多……</text>
		</view>
		
		
		
		<view style="width: 100%; height: 200px;background-color: gray;">
			<view style="font-size: 30px;line-height: 50px;text-shadow: 10px 10px 10px 20px #f00;text-indent: 50px; color: yellow;">
				首页正在施工，请绕道前行……
			</view>
		</view>
	</view>
</template>

<script>
	import api from "../../api/api.js"
	export default {
		data() {
			return {
				loginFlag: 'login-flag',
				href: 'https://uniapp.dcloud.io/component/README?id=uniui',
				imgList: [],
				linkUrl: "https://xinyan.fangte.com",
				show_test: false,
			}
		},
		onPullDownRefresh() {
			this.getAd();
			uni.stopPullDownRefresh();
		},
		onLoad() {
			this.getAd();
		},
		onShow() {
			// console.log('执行了onshow');
			let timer = setTimeout(() => {
				uni.getStorage({
					key: api.base.userInfoHead,
					success: res => {
						// console.log('res',res);	
						if (res.data) {
							this.loginFlag = "login-flag";
						} else {
							this.loginFlag = "";
							this.gotoLogin();
						}
					},
					complete: data =>{
						if(data.data === ""){
							this.gotoLogin();
						}
					}
				})
				clearTimeout(timer);
				timer = null;
			}, 500);
		},
		methods: {
			getAd() {
				api.getAdItemList().then(res => {
					this.imgList = res.data;
					for (var i = 0; i < this.imgList.length; i++) {
						// console.log(this.imgList[i]);
						if (!this.imgList[i].adImgUrl.startsWith('http')) {
							this.imgList[i].adImgUrl = api.base.baseUrl + api.base.getInnerFile +
								"?path=" + this.imgList[i].adImgUrl;

						}
					}
				});
			},

			// 进入商品页面
			gotoDetail(url) {
				let detailUrl = url;
				uni.navigateTo({
					url: "/pages/detail/detail?url=" + detailUrl
				})
			},
			gotoDetail2(url) {
				let xinyanUrl = url;
				uni.navigateTo({
					url: "/pages/detail/detail?url=" + xinyanUrl
				})
			},
			// 跳转到注册页面
			gotoRegister() {
				uni.navigateTo({
					url: "/pages/register/register"
				})
			},
			// 跳转到登录页面
			gotoLogin() {
				uni.navigateTo({
					url: "/pages/login/login"
				})
			}
		}
	}
</script>

<style lang="scss">
	.container {
		padding: 10px;
		font-size: 14px;
		line-height: 24px;
	}

	swiper {
		display: flex;
		flex-direction: row;
		height: 400rpx;
		align-items: center;
		justify-content: center;
		flex-wrap: nowrap;
		overflow: hidden;

		.swiper-item {
			box-sizing: border-box;
			width: 100%;
			height: 500rpx;

			image {
				width: 700rpx;
				height: 500rpx;
			}
		}

		.swiper-item-text {
			position: absolute;
			top: 90%;
			left: 50%;
			transform: translate(-50%, -50%);
			color: #fff;
			font-size: 20rpx;
			font-weight: bold;
		}
	}

	.view-btn {
		margin: 50rpx;
		padding: 50rpx;

		button {
			margin: 50rpx;
		}
	}

	.login-flag {
		visibility: hidden;
	}

	.view-ad {
		position: fixed;
		flex-direction: column;
		justify-content: space-around;
		height: 100%;
	}
</style>